<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>登入页面</title>
    <style type="text/css">
        *{
            margin:0;
            padding:0;
        }
        div{
            position:absolute;
            top:50%;
            left:50%;
            margin:-150px 0 0 -150px;
            width:300px;
            height:300px;
            background:url('./image/4.jpg');background-size:100%;height:300px;
        }
        input{
            width:298px;
            height:30px;
            border: 1px solid black;
            margin-top: 30px;
        }
        button{
            width:298px;
            height:30px;
            border: 1px solid black;
            margin-top: 30px;
            box-sizing: content-box;
            Border-radius:10px;
        }
    </style>
</head>
<body>
<!--编写一个div，div里面有一个form表单，包括两个输入框和登入按钮。
input中的type的text表示的是文本框，password是密码框。
placeholder表示的输入框中的默认文字。required表示必须往输入框输入内容-->
<div>
    <form>
        <input type="text" required="required" placeholder="用户名"/>
        <input type="password" required="required" placeholder="密码"/>
        <button type="submit">登入</button>
    </form>
</div>
</body>
</html>